{% extends 'ApplicationToolsBundle::layout.html.twig' %}

{% block title %}Forms{% endblock %}

{% block stylesheets %}
	<link href="{{ asset('bundles/applicationtools/css/form_elements/uniform.default.css') }}" rel="stylesheet" type="text/css" media="all" />
{% endblock %}

{% block jquery_version %}
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js" type="text/javascript"></script>
{% endblock %}

{% block javascripts %}
    <script src="{{ asset('bundles/applicationtools/js/form/uniform/jquery.uniform.js') }}" type="text/javascript"></script>
	<script type="text/javascript">
	    $(function(){
            $("input, textarea, select, button").uniform();
        });
	</script>
	
	<script src="{{ asset('bundles/applicationtools/js/autosize/jquery.autosize.js') }}" type="text/javascript"></script>
	<script type="text/javascript">
		$(function(){
			$('#normal').autosize();
			$('#animated').autosize({append: "\n"});
		});
	</script>
	
{% endblock %}

{% block body %}

<div class="section">
    <div class="grid_16">
        <h4>Uniform Demo</h4>
		<p><a href="http://uniformjs.com">uniformjs</a></p>
		<p><a href="http://github.com/pixelmatrix/uniform">uniformjs get source on GitHub</a></p>
		<br/>
		<p><a href="http://www.jacklmoore.com/autosize/">autosize</a></p>
		<p><a href="https://github.com/jackmoore/autosize">autosize get source on GitHub</a></p>
    </div>
    <div class="clear"></div>
</div>
<div class="section">
    <div class="grid_16">
		<form>
			<label>Message:</label><textarea cols="40" rows="5"></textarea>
			
			<label>Message normal:</label><textarea id="normal" cols="40" rows="5"></textarea>
			
			<label>Message animated:</label><textarea id="animated" cols="40" rows="5"></textarea>
			
			<label>Your Name:</label><input type="text" size="40"/>
			<label>Your Email:</label><input type="email" size="40"/>
			
			  <label>I found your site:</label>
			  <select>
				<option>Through Google</option>
				<option>Through Twitter</option>
				<option>Other&hellip;</option>
				<option>&lt;Hi&gt;</option>
			  </select>
			  
			  <label><input type="radio" name="radio" /> Saying hi</label>
			  <label><input type="radio" name="radio" /> Sending feedback</label>
			  
			  <label><input type="checkbox" /> Please contact me back</label>
			  
			  <label>Upload a file:</label>
			  <input type="file" />
			  <br/>
			  <input type="submit" />
			  <input type="reset" />
		</form>
{#
		<form>
		  <ul>
			<li><label>Message:</label><textarea cols="40" rows="5"></textarea></li>
			<li><label>Your Name:</label><input type="text" size="40"/></li>
			<li><label>Your Email:</label><input type="email" size="40"/></li>
			<li>
			  <label>I found your site:</label>
			  <select>
				<option>Through Google</option>
				<option>Through Twitter</option>
				<option>Other&hellip;</option>
				<option>&lt;Hi&gt;</option>
			  </select>
			</li>
			<li>
			  <label><input type="radio" name="radio" /> Saying hi</label>
			  <label><input type="radio" name="radio" /> Sending feedback</label>
			</li>
			<li>
			  <label><input type="checkbox" /> Please contact me back</label>
			</li>
			<li>
			  <label>Upload a file:</label>
			  <input type="file" />
			</li>
			<li>
			  <input type="submit" />
			  <input type="reset" />
			</li>
		  </ul>
		</form>
#}
    </div>
    <div class="clear"></div>
</div>

{% endblock %}